<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<!-- JSTL -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
<title>名师专题</title>

<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, shrink-to-fit=no">

<script src="js/jquery-2.0.3.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<link rel="stylesheet" href="./css/x-admin.css" media="all">
<script src="layui/layui.js" charset="utf-8"></script>

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/css/bootstrap.min.css">

<!-- FontAwesome CSS -->
<link rel="stylesheet" href="css/css/font-awesome.min.css">

<!-- ElegantFonts CSS -->
<link rel="stylesheet" href="css/css/elegant-fonts.css">

<!-- themify-icons CSS -->
<link rel="stylesheet" href="css/css/themify-icons.css">

<!-- Swiper CSS -->
<link rel="stylesheet" href="css/css/swiper.min.css">

<!-- Styles -->
<link rel="stylesheet" href="style.css">
<style type="text/css">
.dropdown {
	display: inline-block;
}

.dropdown-content {
	display: none;
	position: absolute;
	background: transparent;
	min-width: 150px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}

.dropdown-content a {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

.dropdown-content a:hover {
	color: #19c880;
}

.dropdown:hover .dropdown-content {
	display: block;
}
</style>
</head>
<body class="about-page">
	<c:if test="${pd==null}">
		<c:redirect url="TeacherEvaServlet?op=teacherInfo"></c:redirect>
	</c:if>
	<div class="page-header">
		<header class="site-header">
			<header class="site-header">
				<div class="top-header-bar">
					<div class="container-fluid">
						<div class="row"></div>
						<!-- .row -->
					</div>
					<!-- .container-fluid -->
				</div>
				<!-- .top-header-bar -->

				<div class="nav-bar">
					<div class="container">
						<div class="row">
							<div class="col-9 col-lg-3">
								<div class="site-branding">
									<h1 class="site-title">
										<a href="Main.jsp" rel="home">Emp<span>Training</span></a>
									</h1>
								</div>
								<!-- .site-branding -->
							</div>
							<!-- .col -->

							<div
								class="col-3 col-lg-9 flex justify-content-end align-content-center">
								<nav
									class="site-navigation flex justify-content-end align-items-center">
									<ul style="overflow: inherit;"
								class="flex flex-column flex-lg-row justify-content-lg-end align-content-center">
									<li class="current-menu-item"><a href="Main.jsp">我的主页</a></li>
									<li><a href="BeforeCourses.jsp">课程浏览</a></li>
									<li>
										<div class="dropdown" id="c1">
											<a href="EmpCourseApl.jsp" class="dropbtn"
												class="current-menu-item">我的课程 <span id="down1"
												class="fa fa-caret-down"
												style="margin-left: 10px; display: block;"></span> <span
												id="up1" class="fa fa-caret-up"
												style="margin-left: 10px; display: none;"></span>
											</a>
											<div class="dropdown-content">
												<a
													href="CCPTServlet?op=queryByEmp&empTel=${sessionScope.username}&applyState=0">申请中</a>
												<a
													href="CCPTServlet?op=queryByEmp&empTel=${sessionScope.username}&applyState=1">已通过</a>
												<a
													href="CCPTServlet?op=queryByEmp&empTel=${sessionScope.username}&applyState=2">未通过</a>
												
											</div>
										</div>
									</li>
									<li><a href="CourseEvaluation.jsp">课程评价</a></li>
									<li><a href="EmpScoreBefore.jsp">我的成绩</a></li>

									<li>
										<div class="dropdown">
											<a href="EmpInfo.jsp" class="dropbtn">个人中心 <span
												id="down" class="fa fa-caret-down"
												style="margin-left: 10px; display: block;"></span> <span
												id="up" class="fa fa-caret-up"
												style="margin-left: 10px; display: none;"></span>
											</a>
											<div class="dropdown-content">
												<a href="EmpInfo.jsp">个人信息</a>
												<a href="#" id="Logout">退出登录</a>
											</div>
										</div>
									</li>


								</ul>
									
									<!-- .header-bar-search -->
								</nav>
								<!-- .site-navigation -->
							</div>
							<!-- .col -->
						</div>
						<!-- .row -->
					</div>
					<!-- .container -->
				</div>
				<!-- .nav-bar -->
			</header>
			<!-- .site-header -->
		</header>
		<!-- .site-header -->

		<div class="page-header-overlay">
			<div class="container">
				<div class="row">
					<div class="col-12">
						<header class="entry-header">
							<h1>名师专题</h1>
						</header>
						<!-- .entry-header -->
					</div>
					<!-- .col -->
				</div>
				<!-- .row -->
			</div>
			<!-- .container -->
		</div>
		<!-- .page-header-overlay -->
	</div>
	<!-- .page-header -->
	
	<div class="container">
		<div style="position: absolute; right: 160px; top: 390px;">
			<span class="x-right" style="line-height: 40px">共有数据：<span
				class="layui-badge">${pd.totalCount}</span> 条
			</span>
			
		</div>
		<div class="container">
			<div class="row">
				<!-- 判断是否为空 -->
				<c:if test="${pd!=null}">
					<!-- 遍历 -->
					<c:forEach items="${pd.data}" var="Teach">

						<div class="col-12 col-md-6 col-lg-3">
							<div class="team-member">
								<img src="${Teach.teacherPic}" alt="">
								
								<h3>姓名：${Teach.teacherName}</h3>
								<h4>${Teach.teacherSex}/${Teach.teacherXl}</h4>

								<div class="course-ratings flex align-items-center" style="margin-left: 35px;">
									<c:if test="${Teach.evalScore==5.0}">

										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="course-ratings-count">${Teach.evalScore}分</span>

									</c:if>

									<c:if test="${Teach.evalScore==4.0}" >

										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star-o"></span>
										<span class="course-ratings-count">${Teach.evalScore}分</span>

									</c:if>
									<c:if test="${Teach.evalScore==3.0}" >

										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="course-ratings-count">${Teach.evalScore}分</span>

									</c:if>
									<c:if test="${Teach.evalScore==2.0}">

										<span class="fa fa-star checked"></span>
										<span class="fa fa-star checked"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="course-ratings-count">${Teach.evalScore}分</span>

									</c:if>
									<c:if test="${Teach.evalScore==1.0}" >

										<span class="fa fa-star checked"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="course-ratings-count">${Teach.evalScore}分</span>

									</c:if>
									<c:if test="${Teach.evalScore==0.0}" >

										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="fa fa-star-o"></span>
										<span class="course-ratings-count">${Teach.evalScore}分</span>

									</c:if>

								</div>

								<ul
									class="p-0 m-0 d-flex justify-content-center align-items-center">
									<li>${Teach.teacherDesc}</li>
								</ul>
							</div>
							<!-- .team-member -->
						</div>
						<!-- .col -->

					</c:forEach>
				</c:if>



			</div>
			<!-- .row -->
			<div id="page" style="position: relative; left: 15px; top: 20px;"></div>
		</div>
		<!-- .container -->



		<script type='text/javascript' src='js/js/jquery.js'></script>
		<script type='text/javascript' src='js/js/swiper.min.js'></script>
		<script type='text/javascript' src='js/js/masonry.pkgd.min.js'></script>
		<script type='text/javascript' src='js/js/jquery.collapsible.min.js'></script>
		<script type='text/javascript' src='js/js/custom.js'></script>
		<script src="./js/x-layui.js" charset="utf-8"></script>
		<script>
		
	layui.use(['laypage', 'layer'], function(){
		  var laypage = layui.laypage,
		  layer = layui.layer;
		  
		laypage.render({
			elem : 'page',
			theme:'#00BFFF',
			count : ${pd.totalCount},//数据总数，从服务端得到
			curr:${pd.page},//得到当前页，以便向服务端请求对应页的数据。
			limit:${pd.pageSize},//得到每页显示的条数
			layout : [ 'prev', 'page', 'next',  ],
			jump : function(obj,first) {
			
				 //obj包含了当前分页的所有参数，
				//首次不执行
			    if(!first){
			    	location.href = "TeacherEvaServlet?op=teacherInfo&page="
						+ obj.curr+"&pageSize="+obj.limit;
			    }
			}
		});
		});

	 
	</script>
	<!--退出登录-->
	<script>
		layui.use([ 'layer' ],function() {
			$ = layui.jquery;//jquery
			layer = layui.layer;//弹出层
			$("#Logout").click(function() {
					layer.confirm('确认要退出登录吗？',function(index) {
						$.ajax({
							url : "LoginServlet",
							type : "get",
							data : {
								op1:"logout"
							},
							success : function(data) {
								if (data.code == 1) {
									location.href = "http://localhost:8080/EmpTrainingTest/Login.jsp";
									return false;
								} 
							},
							dataType : "json"
						});	
					});
				});
			});
	</script>
</body>
</html>
</html>